<template>
	<view class="my_movie">
		<!--  -->
		<view class="box">
			<view class="movie_box" v-for="(item, index) in List" :key="index" @click="gotodetail(item)">
				<view class="img">
					<image :src="item.img" mode="" v-if="item.img"></image>
					<image :src="item.src" mode="" v-else></image>
				</view>
				<view class="text">
					{{item.name}}
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		name: "my_movie",
		data() {
			return {

			};
		}, 
		props: ["List"],
		methods: {
			gotodetail(item) {
				uni.navigateTo({
					url:`../../subpkg/movie_detail/movie_detail?name=${item.name}&director=${item.director}&info=${item.info}&star=${item.star}&classify=${item.classify}&img_src=${item.src}`
				})
				// console.log(item)
			}
		}
	}
</script>

<style lang="scss">
	.box {
		display: flex;
		justify-content: space-between;
		flex-wrap: wrap;
	}
	
	.movie_box {
		height: 173px;
		width: 112px;
		margin: 40rpx 0;
		background-color: rgb(245,245,245);
		// overflow: hidden;
	
		.img {
			image {
				height: 173px;
				width: 112px;
				border-radius: 20px;
			}
		}
	
		.text {
			font-size: 14px;
			color: rgb(122, 122, 122);
		}
	}
</style>
